<div class="container">
  <div>
    Status: {{ !!winner ? 'Winner ' + winner : 'Playing' }}
    <div class="container">
      <div class="mx-5">
        <div>X</div>
        <div>{{ xWins }} Wins</div>
      </div>
      <div class="mx-5">
        <div>O</div>
        <div>{{ oWins }} Wins</div>
      </div>
      <div>
        <div>=</div>
        <div>{{ draw }} Draws</div>
      </div>
    </div>
    <div class="grid-container">
      @for (square of squares; track square; let i = $index) {
        <app-square [iTh]="i" [value]="square" (action)="action(i)" />
      }
    </div>
    <button (click)="rematch()">Rematch</button>
  </div>
</div>
